
.minion{
  position:absolute;
  background-color: #ffed41;
  height: 360px;
  width: 218px;
  border-radius: 218px 218px 130px 130px;
  position:absolute;
  left:50%;
  top:50%;
  margin:20px 0 0 -109px;
}

.glassesline1{
  background-color: #494949;
  border-radius: 4px;
  height: 12px;
  width: 238px;
  position: relative;
  top: 98px;
  margin : 0 -10px;
}
.glassesline2{
  background-color: #2d2d2d;
  border-radius: 4px;
  height: 12px;
  width: 238px;
  position: relative;
  top: 98px;
  margin : 0 -10px;
  -webkit-box-shadow: 0px 3px 0px 0px rgba(0, 0, 0, 0.15);
  -moz-box-shadow:    0px 3px 0px 0px rgba(0, 0, 0, 0.15);
  box-shadow:         0px 3px 0px 0px rgba(0, 0, 0, 0.15);
}

.glass1,.glass2{
  background-color: #e2e2e0;
  height: 102px;
  width: 102px;
  border-radius: 102px;
  position: absolute;
  top: 55px;
  -webkit-box-shadow: -4px 4px 0px 0px rgba(50, 50, 50, 0.15),1px -1px 0px 0px rgba(255, 255, 255, 1);
  -moz-box-shadow:    -4px 4px 0px 0px rgba(50, 50, 50, 0.15),1px -1px 0px 0px rgba(255, 255, 255, 1);
  box-shadow:         -4px 4px 0px 0px rgba(50, 50, 50, 0.15),1px -1px 0px 0px rgba(255, 255, 255, 1);
}
.glass1{
  left: 10px;
  right: auto;
  z-index: 2;
}
.glass2{
  right: 10px;
  left: auto;
  z-index: 1;
}

.glass1:before,.glass2:before{
  background-color: #e5bf36;
  height: 78px;
  width: 78px;
  border-radius: 78px;
  display: block;
  position: relative;
  top: 12px;
  left: 12px;
  content: "";
}

.glass1:after,.glass2:after{
  background-color: #FFF;
  height: 58px;
  width: 78px;
  border-radius: 78px;
  position: absolute;
  top: 22px;
  left: 12px;
  content: "";
  animation: eyes 5s linear 1s infinite;
}

.eye1,.eye2{
  background-color: #724c25;
  height: 28px;
  width: 28px;
  border-radius: 28px;
  position: absolute;
  top: 44px;
  z-index: 3;
}
.eye1{
  left: 46px;
}
.eye2{
  right: 46px;
}
.eye1:before,.eye2:before{
  background-color: #2c2d2f;
  height: 12px;
  width: 12px;
  border-radius: 12px;
  display: block;
  position: relative;
  top: 8px;
  left: 8px;
  content: "";
}
.eye1:after,.eye2:after{
  background-color: #FFF;
  height: 8px;
  width: 8px;
  border-radius: 8px;
  position: absolute;
  top: 6px;
  left: 12px;
  content: "";
}

.mouth{
  background-color: #603814;
  height: 36px;
  width: 106px;
  position: absolute;
  border-radius: 0 0 106px 106px;
  top: 182px;
  left: 55px;
  overflow: hidden;
}
.mouth:before{
  background-color: #FFED41;
  height: 80px;
  width: 205px;
  position: relative;
  display: block;
  border-radius: 0 0 150px 150px;
  top:-70px;
  left:-50px;
  content: "";
  z-index: 2;
  -webkit-box-shadow: 0px 3px 0px 0px rgba(50, 50, 50, 0.15);
  -moz-box-shadow:    0px 3px 0px 0px rgba(50, 50, 50, 0.15);
  box-shadow:         0px 3px 0px 0px rgba(50, 50, 50, 0.15);
}

ul.teeth{
  list-style: none;
  z-index: 1;
  position: absolute;
  top: -10px;
  left: -25px;
}

ul.teeth li{
  float: left;
  height: 15px;
  width: 20px;
  background: #FFF;
  display: inline-block;
  border-radius: 0 0 15px 15px;
}
ul.teeth li:first-child,ul.teeth li:last-child{
  height:10px;
}

.pants{
  background-color: #2b5b89;
  height: 66px;
  position: relative;
  top: 270px;
  border-radius: 0 0 128px 128px;
  z-index: 2;
}
.pants:before{
  background-color: #2b5b89;
  height: 58px;
  width: 138px;
  display: block;
  position: relative;
  top: -58px;
  margin:0 auto;
  content: "";
}
.pants:after{
  background-color: #224467;
  height: 44px;
  width: 58px;
  display: block;
  position: relative;
  top: -76px;
  border-radius: 0 0 58px 58px;
  margin:0 auto;
  content: "";
}
.belt-left,.belt-right{
  background-color: #224467;
  height: 16px;
  width: 70px;
  position: absolute;
  top:225px;
  z-index: 3;
}
.belt-left{
  left:-10px;
  transform: scale(1) rotate(24deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}
.belt-right{
  right:-10px;
  transform: scale(1) rotate(-28deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}
.belt-left:after,.belt-right:after{
  background-color: #2d2d2b;
  height: 11px;
  width: 11px;
  border-radius: 11px;
  position: absolute;
  content: "";
}
.belt-left:after{
  left: 56px;
  top: 3px;
}
.belt-right:after{
  right: 57px;
  top: 3px;
}

.legs .left,.legs .right{
  background: #224467;
  height: 22px;
  width: 44px;
  position: absolute;
  top: 358px;
  z-index: 1;
}
.legs .left{
  left:60px;
}
.legs .right{
  right:60px;
}
.legs .left:after{
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  border-bottom: 22px solid #EC7E65;
  border-right: 10px solid transparent;
}
.legs .right:after{
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  border-bottom: 22px solid #EC7E65;
  border-left: 10px solid transparent;
  right: 0;
}

.shoe-l,.shoe-r{
  background-color: #424242;
  width: 52px;
  height: 18px;
  position: absolute;
  top: 380px;
}
.shoe-l{
  left: 50px;
  border-radius: 18px 0 0 0;
}
.shoe-r{
  right: 50px;
  border-radius: 0 18px 0 0;
}
.shoe-l:after,.shoe-r:after{
  background-color: #2d2d2d;
  width: 56px;
  height: 5px;
  position: absolute;
  content: "";
  top: 18px;
  left: -2px;
}
.shoe-l:before{
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  border-top: 5px solid #224467;
  border-left: 34px solid transparent;
  left: 20px;
}
.shoe-r:before{
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  border-top: 5px solid #224467;
  border-right: 34px solid transparent;
  right: 20px;
}

.hands .left,.hands .right{
  background-color: #e5c034;
  height: 100px;
  width: 16px;
  position:absolute;
  top: 242px;
}
.hands .left{
  left: -16px;
  border-radius: 16px 0 0 0;
}
.hands .right{
  right: -16px;
  border-radius: 0 16px 0 0;
}
.hands .fingers-l,.hands .fingers-r{
  background-color: #424242;
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  top: 350px;
  z-index: 1;
}
.hands .fingers-l{
  left:-6px;
  border-radius: 0 16px 0 0;
}
.hands .fingers-r{
  right:-6px;
  border-radius: 16px 0  0 0;
}
.hands .fingers-l:after,.hands .fingers-r:after{
  background-color: #383838;
  height: 16px;
  width: 16px;
  content: "";
  border-radius: 16px;
  position: absolute;
  top: 15px;
  z-index: 2;
}
.hands .fingers-l:after{
  left: 0px;
}
.hands .fingers-r:after{
  right: 0px;
}
.hands .fingers-l:before,.hands .fingers-r:before{
  background-color: #2c2c2c;
  height: 16px;
  width: 16px;
  content: "";
  border-radius: 16px;
  position: absolute;
  top: 8px;
  z-index: 1;
}
.hands .fingers-l:before{
  left: 5px;
}
.hands .fingers-r:before{
  right: 5px;
}
.hands .glove-l,.hands .glove-r{
  background-color: #424242;
  position: absolute;
  height: 36px;
  width: 16px;
  border-radius: 0 0 16px 16px;
  top: 342px;
  z-index: 3;
}
.hands .glove-l{
  left: -15px;
}
.hands .glove-r{
  right: -15px;
}
.hands .glove-l:before,.hands .glove-r:before{
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  top: -15px;
  border-bottom: 30px solid #424242;
  border-left: 30px solid transparent;
  transform: scale(1) rotate(45deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}
.hands .glove-l:before{
  left:-7px;
}
.hands .glove-r:before{
  right:-7px;
}

/* Animations */
/* Coming soon */